<template>
  <div>
    <van-nav-bar
      title="分类详情"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
    />
    <div v-html="topiclist.content">
    </div>
    <p>专题推荐</p>
    <div class="recommendList" v-for="item in recommendList" :key="item.id">
        <img :src="item.scene_pic_url" alt="">
      <van-card :title="item.title"  />
      <!-- <img :src="item.scene_pic_url" alt="">
      <p>{{item.title}} </p>
       -->
    </div>
  </div>
</template>

<script>
import { detailaction } from "@/api/topic/topicDetail";
export default {
  data() {
    return {
      topiclist: {},
      recommendList: {},
      arr: "",
    };
  },
  created() {
    // console.log(this.$route.query.id);
    detailaction({
      id: this.$route.query.id,
    }).then((res) => {
      console.log(res);
      this.topiclist = res.data;
      this.recommendList = res.recommendList;
      //   this.arr = res.data.content;
    });
  },
  mounted() {},
  methods: {
    onClickLeft() {
      // this.$router.push('/home')
      this.$router.go(-1);
    },
  },
};
</script>

<style lang="scss">
img {
  width: 100%;
}
.recommendList {
  background-color: #fff;
     font-size: .37333rem;
     font-weight: 300;
}
</style>